<template>
    <div>
		<div>
			<a-card>
				<span>
					工单编号：<a-input v-model:value="value" placeholder="请输入" style="width: 14vw; height: 5vh;" allowClear/>
				</span>
				<span style="margin-left: 1vw;">
					工单状态：<a-select v-model:value="value1" placeholder="请输入"  style="width: 14vw; height: 5vh;" allowClear>
								<a-select-option value="代办">代办</a-select-option>
								<a-select-option value="进行">进行</a-select-option>
								<a-select-option value="取消">取消</a-select-option>
								<a-select-option value="完成">完成</a-select-option>
							  </a-select>
				</span>
				<span style="margin-left: 1vw;">
					 <a-button type="primary" style="height: 4.5vh;border-radius: 5px;" @click="seach">
					    <template #icon><SearchOutlined /></template>
					    查询
					  </a-button>
				</span>
			</a-card>
		</div>
        <div style="margin-top: 3vh;">
			<a-card >
				<div>
					<span>
						<a-button type="link" style="color:#fff; height: 5vh; background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); " @click="showModal">
						   <template #icon><PlusCircleOutlined /></template>
						   新建
						 </a-button>
						 
					</span>
					<!-- <span style="margin-left: 1vw;">
						<a-button type="text"  style="height: 5vh; background-color: #f3e7e1;"  @click="showModal1">
						   工单配置
						 </a-button>
					</span> -->
				</div>
				<div style="margin-top: 3vh;">
					<a-table
					      :columns="columns"
					      :data-source="data"
						  :pagination="false"
						  :rowKey="unkey"
					    >
						<!-- 操作 -->
						<template #czsj="{ record }">
							 <!-- <a-button type="link" @click="showModal3(record)">查看详情</a-button> -->
							 <a  @click="showModal3(record)">查看详情</a>
						 </template>
					  </a-table>
				</div>
				<!-- 分页 -->
				<div style="margin-top: 2.5vh; margin-bottom: 4vh;">
					<span style="color:#dbe5ef; font-size: 1rem; margin-left: 1rem;">
						共{{total}}条记录&nbsp;&nbsp;第 {{current}}/{{ Math.ceil(total/pageSize)}}页
					</span>
					<span style="float: right;">
						<span style="margin-right: 3vw;">
							<a-button style="background: #d5ddf8;" :disabled="current<=1" @click="onup">上一页</a-button>
						</span>
						<span style="margin-right: 4vw;">
							<a-button style="background: #d5ddf8;" :disabled="current>=Math.ceil(total/pageSize)" @click="ondown">下一页</a-button>
						</span>
					</span>
				</div>
			</a-card>
		</div>
		<!-- 用于存放对话框 -->
		<div>
			 <a-modal v-model:visible="visible" title="新增工单" :footer="null" style="width: 40vw; height: 30vh;" destroyOnClose>
			      <a-form
			          ref="formRef"
			          :model="formState"
			          :rules="rules"
			          :label-col="labelCol"
			          :wrapper-col="wrapperCol"
			        >
			          <a-form-item ref="sbid" label="设备编号" name="sbid">
			            <!-- <a-input placeholder="请输入" v-model:value="formState.sbid" showCount :maxlength="15"/> -->
						<a-select v-model:value="formState.sbid" placeholder="请选择">
						  <a-select-option v-for="item,index in lists" :key="index" :value="item._id">{{item.name}}</a-select-option>
						</a-select>
			          </a-form-item>
			          <a-form-item label="工单类型" name="gdlx">
			            <a-select v-model:value="formState.gdlx" placeholder="请选择">
			              <a-select-option value="补货工单">补货工单</a-select-option>
			            </a-select>
			          </a-form-item>
					  <a-form-item label="补货数量">
					    <a-button type="link" style="font-size: 1rem;" @click="showModal2"> <FileTextOutlined />补货清单</a-button>
					  </a-form-item>
					  <a-form-item label="运维人员" name="yyry">
					    <a-select v-model:value="formState.yyry" placeholder="请选择">
					      <a-select-option v-for="item,index in lis" :key="index" :value="item._id">{{item.pname}}</a-select-option>
					    </a-select>
					  </a-form-item>
			          <a-form-item label="备注" name="bz">
			            <a-textarea placeholder=" 请输入备注 (不超过40字)" v-model:value="formState.bz"  showCount :maxlength="40"/>
			          </a-form-item>
			          <a-form-item :wrapper-col="{ span: 12, offset: 6 }">
			            <a-button style="margin-right: 2vw;background: #fbf4f0;border: 0; width: 5vw;"  @click="handleQx">取消</a-button>
			            <a-button style="margin-left: 2vw;background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); border: 0; width: 5vw; color: #fff;" @click="onSubmit">确定</a-button>
			          </a-form-item>
			        </a-form>
			</a-modal>
			<a-modal v-model:visible="visible1" title="工单配置" :footer="null">
			     <a-form
			         ref="formRef"
			         :model="formState1"
			         :label-col="labelCol"
			         :wrapper-col="wrapperCol"
			       >
			         <a-form-item  label="补货警戒线:" name="num">
						 <a-input-number :min="1" :max="100000" v-model:value="formState1.num" style="width: 18vw; text-align: center;" autofocus/>
			         </a-form-item>
			         <a-form-item :wrapper-col="{ span: 12, offset: 6 }">
					   <a-button style="margin-right: 2vw;background: #fbf4f0;border: 0; width: 5vw;"  @click="handleQx1">取消</a-button>
			           <a-button style="margin-left: 2vw;background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); border: 0; width: 5vw; color: #fff;" @click="handleOk1">确定</a-button>
			         </a-form-item>
			       </a-form>
			</a-modal>
			<a-modal v-model:visible="visible2" title="补货详情" :footer="null" class="moodel3"  @cancel="oncancel">
				<div>
					<div>
						<a-table
						      :columns="columns1"
						      :data-source="data1"
							  :pagination="false"
							  style="margin: -1.5vh 0 0 -1vw; height: 43vh;"
						    >
						  </a-table>
					</div>
					<div style="margin-left: 7vw; margin-top: 3vh;">
					<a-button style="margin-right: 2vw;background: #fbf4f0;border: 0; width: 5vw;"  @click="handleQx2">取消</a-button>
			           <a-button style="margin-left: 2vw;background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); border: 0; width: 5vw; color: #fff;" @click="handleOk2">确定</a-button>
				</div>
				</div>
			</a-modal>
			<a-modal v-model:visible="visible1" title="工单配置" :footer="null">
			     <a-form
			         ref="formRef"
			         :model="formState1"
			         :label-col="labelCol"
			         :wrapper-col="wrapperCol"
			       >
			         <a-form-item  label="补货警戒线:" name="num">
						 <a-input-number :min="1" :max="100000" v-model:value="formState1.num" style="width: 18vw; text-align: center;" autofocus/>
			         </a-form-item>
			         <a-form-item :wrapper-col="{ span: 12, offset: 6 }">
					   <a-button style="margin-right: 2vw;background: #fbf4f0;border: 0; width: 5vw;"  @click="handleQx1">取消</a-button>
			           <a-button style="margin-left: 2vw;background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); border: 0; width: 5vw; color: #fff;" @click="handleOk1">确定</a-button>
			         </a-form-item>
			       </a-form>
			</a-modal>
			<a-modal v-model:visible="visible3" title="工单详情" :footer="null" >
				 <div>
					 <div style="background-color: #f8f8f8;height: 8vh;" v-if="selectone.gdstatus=='代办'">
						 <span >
							 <img src="../img/1.png" alt="" style="margin-top: -1vh;">
						 </span>
						 <span style="margin-left: 1.5vw;">
								<span style="margin-top: -1vh;">代办</span>
						 </span>
						 <span style="margin-left: 18vw;">
							 <img src="../img/2.png" alt="" style="margin-top: -1vh;">
						 </span>
					 </div>
					 <div style="background-color: #f8f8f8;height: 8vh;" v-if="selectone.gdstatus=='取消'">
						 <span >
							 <img src="../img/3.png" alt="" style="margin-top: -1vh;">
						 </span>
						 <span style="margin-left: 1.5vw;">
								<span style="margin-top: -1vh;">取消</span>
						 </span>
						 <span style="margin-left: 18vw;">
							 <img src="../img/4.png" alt="" style="margin-top: -1vh;">
						 </span>
					 </div>
					 <div style="background-color: #f8f8f8;height: 8vh;" v-if="selectone.gdstatus=='完成'">
						 <span >
							 <img src="../img/5.png" alt="" style="margin-top: -1vh;">
						 </span>
						 <span style="margin-left: 1.5vw;">
								<span style="margin-top: -1vh;">完成</span>
						 </span>
						 <span style="margin-left: 18vw;">
							 <img src="../img/6.png" alt="" style="margin-top: -1vh;">
						 </span>
					 </div>
					 <div style="margin-top: 3vh;">
						 <a-descriptions :column="2">
						     <a-descriptions-item label="设备编号">{{selectone.sbid.name}}</a-descriptions-item>
						     <a-descriptions-item label="创建日期">{{selectone.cjtime}}</a-descriptions-item>
						     <a-descriptions-item label="运维人员">{{selectone.yyry.pname}}</a-descriptions-item>
							 <a-descriptions-item label="取消时间" v-if="selectone.gdstatus=='取消'">{{selectone.wctime}}</a-descriptions-item>
							 <a-descriptions-item label="完成时间" v-if="selectone.gdstatus=='完成'">{{selectone.wctime}}</a-descriptions-item>
						     <a-descriptions-item label="工单类型">{{selectone.gdlx}}</a-descriptions-item>
						     <a-descriptions-item label="工单方式">
						       {{selectone.fs}}
						     </a-descriptions-item>
							 <a-descriptions-item label="补货数量">
								 <a-button type="link" style="margin-top: -.6vh;" @click="showModal4"> 补货清单</a-button>
							 </a-descriptions-item>
							 <a-descriptions-item label="备注">{{selectone.bz}}</a-descriptions-item>
						   </a-descriptions>
					 </div>
					 <div  v-if="selectone.gdstatus=='代办'" style="text-align: center; margin-top: 2vh;">
						 <a-button  style="background:#fbf4f0; border: 0; font-size: .9rem;margin-bottom: 3vh;" @click="showModal5"> 取消工单</a-button>
					 </div>
					 <div  v-if="selectone.gdstatus=='取消'" style="text-align: center; margin-top: 2vh;">
					 	<a-button  style="background:#fbf4f0; border: 0; font-size: .9rem;margin-bottom: 3vh;" @click="showModal6"> 重新创建</a-button>
					 </div>
				 </div>
			</a-modal>
			<a-modal v-model:visible="visible4" title="补货详情" :footer="null" @cancel="oncancel2">
				<a-table
				      :columns="columns2"
				      :data-source="selectone.qd"
					  :pagination="false"
					  style="margin: -1.5vh 0 0 -1vw; height: 43vh;"
				    >
				  </a-table>
			</a-modal>
			<a-modal v-model:visible="visible5"  :footer="null" :closable="false" width="28vw">
				<span>
					<InfoCircleFilled style="color:#ff665f; font-size: 1.2rem;"/>
				</span>
				<span style="margin-left: 1vw; font-size: 1rem;">
					取消工单后，将不能恢复，是否确定取消？
				</span>
				<div style="margin-top: 5vh; margin-bottom: 2vh;margin-left: 7vw;">
					<span>
						<a-button @click="handleQx5"> 取消</a-button>
					</span>
					<span style="margin-left: 2vw;">
						<a-button style="background: #7f9dff;color:#fff;" @click="handleOk5"> 确定</a-button>
					</span>
				</div>
			</a-modal>
			<a-modal v-model:visible="visible6" title="重建工单" :footer="null" style="width: 40vw; height: 30vh;">
			 <a-form
				 ref="formRef"
				 :model="selectones"
				 :rules="rules"
				 :label-col="labelCol"
				 :wrapper-col="wrapperCol"
			   >
				 <a-form-item ref="sbid" label="设备编号" name="sbid">
				   <!-- <a-input placeholder="请输入" v-model:value="selectone.sbid" showCount :maxlength="15"/> -->
				   <a-select v-model:value="selectones.sbid" placeholder="请选择">
				     <a-select-option v-for="item,index in lists" :key="index" :value="item._id">{{item.name}}</a-select-option>
				   </a-select>
				 </a-form-item>
				 <a-form-item label="工单类型" name="gdlx">
				   <a-select v-model:value="selectones.gdlx" placeholder="请选择">
					 <a-select-option value="补货工单">补货工单</a-select-option>
				   </a-select>
				 </a-form-item>
				  <a-form-item label="补货数量">
					<a-button type="link" style="font-size: 1rem;" @click="showModal2"> <FileTextOutlined />补货清单</a-button>
				  </a-form-item>
				  <a-form-item label="运维人员" name="yyry">
					<a-select v-model:value="selectones.yyry" placeholder="请选择">
					  <a-select-option v-for="item,index in lis" :key="index" :value="item._id">{{item.pname}}</a-select-option>
					</a-select>
				  </a-form-item>
				 <a-form-item label="备注" name="bz">
				   <a-textarea placeholder=" 请输入备注 (不超过40字)" v-model:value="selectones.bz"  showCount :maxlength="40"/>
				 </a-form-item>
				 <a-form-item :wrapper-col="{ span: 12, offset: 6 }">
				   <a-button style="margin-right: 2vw;background: #fbf4f0;border: 0; width: 5vw;"  @click="handleQxs">取消</a-button>
				   <a-button style="margin-left: 2vw;background-image: linear-gradient(-60deg, #ff5858 0%, #f09819 100%); border: 0; width: 5vw; color: #fff;" @click="onSubmits">确定</a-button>
				 </a-form-item>
			   </a-form>
			</a-modal>
		</div>
    </div>
</template>

<script  lang="ts">
import { defineComponent,reactive, ref, toRaw,onMounted } from 'vue'
import { ValidateErrorEntity } from 'ant-design-vue/es/form/interface';
import axios from 'axios'
let baseurl = "http://localhost:3201/api";
import { SearchOutlined,PlusCircleOutlined,SmileOutlined, DownOutlined,FileTextOutlined,InfoCircleFilled } from '@ant-design/icons-vue';
interface FormState {
  sbid: string;
  gdlx: string | undefined;
  yyry: string | undefined;
  bz: string;
}
// 表格的列
	const columns = [
	  {
	    title: "序号",
	    dataIndex: "_id",
	  },
	  {
	    title: "工单编号",
	    dataIndex: "gdid",
	  },
	  {
	    title: "设备编号",
	    dataIndex: "sbid.name",
	  },
	  {
	    title: "工单类型",
	    dataIndex: "gdlx",
	  },
	  {
	    title: "工单方式",
	    dataIndex: "fs",
	  },
	  {
	    title: "工单状态",
	    dataIndex: "gdstatus",
		slots: {
			customRender: 'vipstatu',
		},
	  },
	  {
	    title: "运维人员",
	    dataIndex: "yyry.pname",
	  },
	  {
	    title: "创建日期",
	    dataIndex: "cjtime",
	  },
	  {
		  title:"操作",
		  dataIndex: "_id",
		  slots: {
		  	customRender: 'czsj',
		  },
	  }
	];
	const columns1 = [
	  {
	    title: "货道编号",
	    dataIndex: "hdid",
	  },
	  {
	    title: "商品名称",
	    dataIndex: "shopname",
	  },
	  {
	    title: "当前数量",
	    dataIndex: "shopnum",
	  },
	  {
	    title: "还可添加",
	    dataIndex: "tj",
	  },
	  {
	    title: "补满数量",
	    dataIndex: "bm",
	  },
	];
const columns2 = [
	  {
	    title: "货道编号",
	    dataIndex: "id",
	  },
	  {
	    title: "商品",
	    dataIndex: "sname.name",
	  },
	  {
	    title: "补满数量",
	    dataIndex: "num",
	  },
	];
export default defineComponent({
	 components: {
	    SearchOutlined,
		PlusCircleOutlined,
		SmileOutlined,
		DownOutlined,
		FileTextOutlined,
		InfoCircleFilled,
	  },
    setup() {
		const data1=ref([])
		const data =ref([
		 
		])
		// 工单编号搜索框
		const selectone=ref({})
        const value = ref<string>('');
		// 工单状态的下拉框
		const value1 = ref<string | undefined>(undefined);
		// 当前页
		const unkey=ref(0)
		const current = ref<number>(1);
		// 每页条数
		const pageSize = ref(10);
		// 总数量
		const total = ref(48);
		// 上一页
		const onup=()=>{
			current.value--
			showList()
		}
		// 下一页
		const ondown=()=>{
			current.value++
			showList()
		}
		const visible = ref<boolean>(false);
		const visible1 = ref<boolean>(false);
		const visible2 = ref<boolean>(false);
		const visible3 = ref<boolean>(false);
		const visible4 = ref<boolean>(false);
		const visible5 = ref<boolean>(false);
		const visible6 = ref<boolean>(false);
		const showModal = () => {
		  visible.value = true;
		};
		const showModal1 = () => {
		  visible1.value = true;
		};
		const showModal6 = () => {
		  console.log(toRaw(selectones))
		  visible3.value=false;
		  visible6.value = true;
		};
		const showModal2 = () => {
		  visible.value = false;
		  visible2.value = true;
		};
		const showModal3 = (record) => {
		  selectone.value=toRaw(record)
		  let arr=JSON.parse(JSON.stringify(toRaw(record)))
		  // console.log(toRaw(record))
		  selectones.value=arr
		  selectones.value.sbid=arr.sbid._id
		  selectones.value.yyry=arr.yyry._id
		  selectones.value.gdstatus="代办"
		  console.log(toRaw(selectones.value))
		  visible3.value = true;
		};
		const showModal4 = () => {
		  visible3.value = false;
		  visible4.value = true;
		};
		const showModal5 = () => {
		  visible3.value = false;
		  visible5.value = true;
		};
		const handleOk = () => {
		  visible.value = false;
		};
		const handleOk1 = () => {
		  visible1.value = false;
		};
		const handleOk2 = () => {
		  visible2.value = false;
		  visible.value = true;
		};
		const handleQx = () => {
		  visible.value = false;
		};
		const handleQxs = () => {
		  
		  visible6.value = false;
		};
		const handleQx1 = () => {
		  visible1.value = false;
		};
		const handleQx2 = () => {
		  visible2.value = false;
		  visible.value = true;
		};
		const handleOk5 = () => {
		let arr=toRaw(data.value)
		  // arr.forEach(item=>{
			 // if(item._id==toRaw(selectone.value)._id){
				//  item.gdstatus="取消"
				//  item.wctime=`${new Date().getFullYear()}`+'.'+`${new Date().getMonth() +1 < 10 ? "0" + (new Date().getMonth() +1) : new Date().getMonth() +1}`+"."+`${new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate()}`+' '+`${new Date().getHours()}`+":"+`${new Date().getMinutes() < 10 ? "0" + new Date().getMinutes() : new Date().getMinutes()}`+":"+`${new Date().getSeconds() < 10 ? "0" + new Date().getSeconds() : new Date().getSeconds()}`
			 // }
		  // })
		  // data.value=arr
		  let wctime=`${new Date().getFullYear()}`+'.'+`${new Date().getMonth() +1 < 10 ? "0" + (new Date().getMonth() +1) : new Date().getMonth() +1}`+"."+`${new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate()}`+' '+`${new Date().getHours()}`+":"+`${new Date().getMinutes() < 10 ? "0" + new Date().getMinutes() : new Date().getMinutes()}`+":"+`${new Date().getSeconds() < 10 ? "0" + new Date().getSeconds() : new Date().getSeconds()}`
		  axios.put(`http://localhost:3201/api/word/qx?_id=${toRaw(selectone.value)._id}&wctime=${wctime}`).then(resx=>{
				  visible5.value = false;
				  unkey.value+=1
				  showList()
		  })
		};
		const handleQx5 = () => {
		  visible5.value = false;
		  visible3.value=true
		};
		const formRef = ref();
		let formStates= reactive({})
		let selectones=ref({})
		let formState = reactive({
		  sbid: undefined,
		  gdlx: undefined,
		  yyry:undefined,
		  bz: '',
		  qd:[],
		  gdid:`${new Date().getFullYear()}`+`${new Date().getMonth() +1 < 10 ? "0" + (new Date().getMonth() +1) : new Date().getMonth() +1}`+`${new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate()}`+`${new Date().getHours()}`+`${new Date().getMinutes()}`+`${new Date().getSeconds()}`,
		  fs:"手动",
		  gdstatus:"代办",
		  cjtime:`${new Date().getFullYear()}`+'.'+`${new Date().getMonth() +1 < 10 ? "0" + (new Date().getMonth() +1) : new Date().getMonth() +1}`+"."+`${new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate()}`+' '+`${new Date().getHours()}`+":"+`${new Date().getMinutes() < 10 ? "0" + new Date().getMinutes() : new Date().getMinutes()}`+":"+`${new Date().getSeconds() < 10 ? "0" + new Date().getSeconds() : new Date().getSeconds()}`,
		  wctime:`${new Date().getFullYear()}`+'.'+`${new Date().getMonth() +1 < 10 ? "0" + (new Date().getMonth() +1) : new Date().getMonth() +1}`+"."+`${new Date().getDate() < 10 ? "0" + new Date().getDate() : new Date().getDate()}`+' '+`${new Date().getHours()}`+":"+`${new Date().getMinutes() < 10 ? "0" + new Date().getMinutes() : new Date().getMinutes()}`+":"+`${new Date().getSeconds() < 10 ? "0" + new Date().getSeconds() : new Date().getSeconds()}`,
		  uid:"运营",
		});
		const formState1=reactive({
			num:3
		})
		const rules = {
		  sbid: [
			{ required: true, message: '请输入', trigger: 'blur' },
		  ],
		  gdlx: [{ required: true, message: '请选择', trigger: 'change' }],
		  yyry: [{ required: true, message: '请选择', trigger: 'change' }],
		  bz: [{ required: true, message: '请输入', trigger: 'blur' }],
		};
		const onSubmit =() => {
		  formRef.value
			.validate()
			.then(() => {
			  console.log(formState)	
			  axios.post(`http://localhost:3201/api/word/add`,toRaw(formState)).then(resx=>{
				  handleOk()
				  showList()
			  })
			  // console.log(toRaw(formState))
			  
			})
			.catch((error: ValidateErrorEntity<FormState>) => {
			  console.log('error', error);
			});
		};
		const onSubmits = () => {
		  formRef.value
			.validate()
			.then(() => {
			  axios.put(`http://localhost:3201/api/word/cg?_id=${toRaw(selectones.value)._id}`,toRaw(selectones.value)).then(res=>{
			  	 visible6.value=false
			  	 unkey.value+=1
			  	 showList()
			  })
			  console.log()
			})
			.catch((error: ValidateErrorEntity<FormState>) => {
			  console.log('error', error);
			  visible6.value=false
			});
		};
		const resetForm = () => {
		  formRef.value.resetFields();
		};
		onMounted(() => {
			showList()
			showlists()
		})
		const lis=ref([])
		const lists=ref([])
		const showlists=async()=>{
			await axios.get(`http://localhost:3201/api/word/sblis`).then(res=>{
				lis.value=res.data.data
			})
			await axios.get(`http://localhost:3201/api/word/eqlis`).then(res=>{
				lists.value=res.data.data
			})
		}
		const showList=async()=>{
			await axios.get(`http://localhost:3201/api/work/list?pageSize=${pageSize.value}&pageIndex=${current.value}&seachname=${value.value}&value=${value1.value}`).then(res=>{
				console.log(value.value,1,value1.value)
				console.log(res.data)
				data.value=res.data.data
				total.value=res.data.count
			})
		}
		const oncancel2=()=>{
			visible4.value=false
			visible3.value=true
		}
		const oncancel1=()=>{
			visible2.value=false
			visible.value=true
		}
		const seach=()=>{
			showList()
		}
		return {
		  selectones,
		  lis,
		  lists,
		  seach,
		  unkey,
		  value,
		  oncancel2,
		  oncancel1,
		  value1,
		  data,
		  data1,
		  columns1,
		  columns2,
		  columns,
		  current,
		  pageSize,
		  total,
		  onup,
		  ondown,
		  visible,
		  visible6,
		  visible5,
		  showModal,
		  showModal6,
		  showModal5,
		  handleOk,
		  handleOk5,
		  visible1,
		  visible3,
		  visible4,
		  showModal1,
		  showModal3,
		  showModal4,
		  handleOk1,
		  handleQx,
		  handleQxs,
		  handleQx5,
		  handleQx1,
		  formRef,
		  labelCol: { span: 5 },
		  wrapperCol: { span: 17 },
		  other: '',
		  formState,
		  formStates,
		  rules,
		  onSubmit,
		  onSubmits,
		  resetForm,
		  formState1,
		  visible2,
		  showModal2,
		  handleOk2,
		  handleQx2,
		  selectone,
		};
    },
})
</script>

<style scoped lang='scss'>
.ant-input-number-input{
	text-align: center;
}

</style>
